<!--
 * @Author: ChunLai
 * @Date: 2022-04-06 11:26:26
 * @LastEditTime: 2025-01-02 10:28:35
 * @Description: 接口返回的pdf --- 待定
 * @FilePath: \01.latest-short-insure\src\views\read\PdfFileApi.vue
-->
<template>
  <div class="html-img-read pdbt_100">
    <div class="notice-img" @click="handlePreview(fileObj.imgs)">
      <img
        v-for="(ele, idx) in fileObj.imgs"
        :key="idx"
        :src="ele + '?v=' + imgVersion"
      />
    </div>
    <van-image-preview v-model="showPreview" :images="pdfImgs">
    </van-image-preview>
    <FooterBtns :btnNum="1" @saveForm="sureClick" />
  </div>
  <!-- <div class="fee-count-pre-module">
    <van-image-preview :pdfImgs="pdfImgs"></van-image-preview>
    <div class="right-fix-btn" v-if="pdfh5">
      <div class="count-down" v-if="countNum > 0">
        {{ `${countNum}s` }}
      </div>
      <div class="read-back" @click="sureClick" v-else>我已阅读</div>
    </div>
    <div id="demo"></div>
  </div> -->
</template>

<script>
import { pdfJs } from "@/utils/pdfh5";
export default {
  name: "PdfFileApi",
  props: ["fileObj"],
  data() {
    return {
      showPreview: false, // 新加图片预览
      // images: [],
      imgVersion: new Date().getTime(),
      pdfh5: null,
      countNum: 5,
      timeOut: null,
      pdfImgs: [],
    };
  },
  created() {
    // let that = this
    // if (window.Pdfh5) {
    //   return that.initPdf();
    // }
    // pdfJs(function (res) {
    this.initPdf();
    // })
  },
  methods: {
    initPdf() {
      this.$store.commit("updateLoad", true);
      let obj = {
        worknum: this.workNum,
        orderNum: this.orderNum,
        type: this.fileObj.value + "",
      };
      this.$http
        .post("https://wxsc.mschn.cn/ms-insure/mobile/yangguang/getPDFUrl", obj)
        .then(({ data }) => {
          this.$store.commit("updateLoad", false);
          console.log(data.pathList);
          this.$nextTick(() => {
            this.pdfImgs = data.pathList;
            this.countDownEvent();
          });
        });
    },
    countDownEvent() {
      this.timeOut = setInterval(() => {
        this.countNum--;
        if (this.countNum <= 0) {
          clearInterval(this.timeOut);
        }
      }, 1000);
    },
    handlePreview(arrs) {
      this.pdfImgs = arrs;
      this.showPreview = true;
    },
    sureClick() {
      this.$emit("sureClick");
    },
  },
};
</script>

<style lang="less" scoped>
.fee-count-pre-module {
  width: 100%;
  margin-top: 10px;
  height: calc(100vh - 60px);
}

.right-fix-btn {
  position: fixed;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  z-index: 99;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 50px;
  color: #ffffff;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 12px 0px;

  .count-down {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    line-height: 42px;
    text-align: center;
    font-size: 20px;
    background-color: #fb8c89;
  }

  .read-back {
    width: 60%;
    height: 38px;
    line-height: 38px;
    font-size: 16px;
    letter-spacing: 2px;
    text-align: center;
    background-color: #f52119;
    border-radius: 25px;
  }
}
</style>
